<template>
	<view class="">
		<navigationBar :back_bool="back_bool" :title="title" :btn="btn_bool" ></navigationBar>
		<view  style="width: 100%;height: 100%; background-color: #CCCCCC;position: fixed;" :style="{backgroundColor:by_color}"></view>
		<view class="content" >
			
			<u-button class="btns" type="error" @click="getlocation">获取定位</u-button>
			<u-button class="btns" type="warn" @click="CountDown">倒计时</u-button>
			<u-button class="btns" type="primary" @click="toWeb">跳转网页</u-button>
			<u-button class="btns" type="primary" @click="getCode">验证码</u-button>
			<u-button class="btns" type="error" @click="tabs">Tabs</u-button>
			<u-button class="btns" type="warn" @click="preview">img预览</u-button>
			<u-button class="btns" type="error" @click="img_upload">img上传</u-button>
			<u-button class="btns" type="warn" @click="waterfall">瀑布流</u-button>
			<u-button class="btns" type="primary" @click="Lucky_draw">抽奖</u-button>
			<u-button class="btns" type="primary" @click="triangle">三角形</u-button>
			<u-button class="btns" type="error" @click="popup">弹出层</u-button>
			<u-button class="btns" type="primary" @click="input_sel">下拉框</u-button>
			<u-button class="btns" type="warn" @click="write">写字板</u-button>
			<u-button class="btns" type="primary" @click="wuliu">物流</u-button>
			<u-button class="btns" type="error" @click="icon_font">字体图标</u-button>
			<u-button class="btns" type="error" @click="to_storage">Storage/Vuex</u-button>
			<u-button class="btns" type="warn" @click="to_debugger">debugger</u-button>
			
			
			<!-- <u-button class="btns" type="primary" @click="test">test.vue</u-button> -->
				
		</view>
	</view>
	
</template>

<script>
	import navigationBar from "@/components/navigation-bar/navigation-bar.vue" //导航栏
	import {
		mapState,
		mapMutations,
		mapGetters
	} from 'vuex';
	export default {
		computed: {
			...mapGetters(['by_color'])
		},
		components: {
			navigationBar,
		},
		data() {
			return {
				title:'API',
				back_bool: false,
				btn_bool: false
			}
		},
		onLoad() {

		},
		methods: {
			CountDown(){
				uni.navigateTo({
					url:"/API/CountDown"
				})
			},
			getlocation(){
				uni.navigateTo({
					url:"/API/location"
				})
			},
			toWeb(){
				uni.navigateTo({
					url:"/API/web"
				})
			},
			getCode(){
				uni.navigateTo({
					url:"/API/Verification_code"
				})
			},
			tabs(){
				uni.navigateTo({
					url:"/API/tabs"
				})
			},
			preview(){
				uni.navigateTo({
					url:"/API/preview"
				})
			},
			img_upload(){
				uni.navigateTo({
					url:"/API/img_upload"
				})
			},
			waterfall(){
				uni.navigateTo({
					url:"/API/water_fall"
				})
			},
			Lucky_draw(){
				uni.navigateTo({
					url:"/API/Lucky_draw"
				})
			},
			test(){
				uni.navigateTo({
					url:"/API/test/test"
				})
			},
			triangle(){
				uni.navigateTo({
					url:"/API/triangle"
				})
			},
			//弹出层
			popup(){
				uni.navigateTo({
					url:"/API/popup"
				})
			},
			input_sel(){
				uni.navigateTo({
					url:"/API/input_sel"
				})
			},
			write(){
				uni.navigateTo({
					url:'/API/write'
				})
			},
			wuliu(){
				uni.navigateTo({
					url:'/API/wuliu'
				})
			},
			icon_font(){
				uni.navigateTo({
					url:'/API/icon_font'
				})
			},
			to_storage(){
				uni.navigateTo({
					url:'/API/Storage'
				})
			},
			to_debugger(){
				uni.navigateTo({
					url:'/API/Debugge'
				})
			},
			
		}
	}
</script>

<style lang="scss">
	.content {
		display: flex;
		flex-direction: row;
		align-items: center;
		flex-wrap: wrap;
		justify-content: center;
		opacity: .9;
		.btns{
			width: 200rpx;
			margin-top: 10rpx;
		}
	}
</style>
